<template>
  <div class="excel-container">
    <UploadExcel :before-upload="beforeUpload" :on-success="onSuccess" />
  </div>
</template>

<script>
import { locationUpload } from '@/api'
export default {
  name: 'ImportExcel',
  methods: {
    beforeUpload(file) {
      // 这个函数必须 return 一个布尔值 并且只有 return 出去的是 true 的时候才会执行后续的解析 excel 的操作
      // 如果 reture false，表示校验不通过，不会进行正式的解析操作
      console.log('上传前', file)
      // 文件大小超过 1M 不允许导入
      const isLt1M = file.size / 1024 / 1024 < 1 // 小于1M
      if (isLt1M) {
        return true
      }
      this.$message({
        message: '文件体积不能超过1M',
        type: 'warning'
      })
      return false
    },
    async onSuccess({ results, header }) {
      // results：表体数据
      // header：表头数据
      console.log('上传完成', results, header)
      // 中英文对照关系
      const headerRelation = {
        所属仓库: 'warehouseName',
        库区编号: 'code',
        库区名称: 'name',
        温度类型: 'temperatureType',
        承重类型: 'bearingType',
        用途属性: 'useType',
        库区状态: 'status',
        负责人: 'createName',
        联系电话: 'phone',
        库位数量: 'includedNum',
        更新时间: 'updateTime'
      }
      const data = this.getImportData(results, headerRelation)
      // console.log(this.getImportData(results, headerRelation))
      console.log(data)
      const formdata = new FormData()
      formdata.append('file', data)
      console.log(formdata)
      await locationUpload(formdata)
    },
    // 转换集合中对象的key为英文
    getImportData(results, headerRelation) {
      const resultsArr = []
      // 将原始数组便利一下拿出里面的每一项
      results.forEach((item) => {
        const obj = {}
        // 将每一项的key拿出来转换为对应的英文key
        Object.keys(item).forEach((child) => {
          // 通过headerRelation[child]找到对应的英文key
          // 定义一个空对象 通过 [] 对这个空对象添加属性obj[英文的key] = 原始对象[中文的key]
          obj[headerRelation[child]] = item[child]
        })
        // 将新的obj 放到结果数据中
        resultsArr.push(obj)
        // console.log(resultsArr)
      })
      // 将结果数组return
      return resultsArr
    }
  }
}
</script>

